<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" >
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Hello, world</title>

<script type="text/javascript" src="http://api.amap.com/webapi/init?v=1.1">  
</script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js">
</script>
<script type="text/javascript">
    var mapObj;  
    function getLnglat(e){  
        $("#xy").val(e.lnglat.toString());
    }; 
    function initialize() {
        mapObj = new AMap.Map("container",{level:5}); // 创建地图实例
        var cp = $("#_copyright_" + mapObj.id);
        cp[0].innerHTML = ""; // 去掉Copyright
        mapObj.plugin(["AMap.ToolBar","AMap.OverView,AMap.Scale"], function() {

        // 加载工具条
        tool = new AMap.ToolBar({
                direction: false, // 隐藏方向导航
                ruler: false, // 隐藏视野级别控制尺
                autoPosition: false // 禁止自动定位
            });
            mapObj.addControl(tool);

        // 加载鹰眼
            view = new AMap.OverView();
            mapObj.addControl(view);

        // 加载比例尺
            scale = new AMap.Scale();
            mapObj.addControl(scale);
        });

        // 绑定事件
        //function eventHandler() {
        //    alert("You clicked me!");
        //}
        //mapObj.bind(mapObj, "click", eventHandler);

        var point = new AMap.LngLat(116.404, 39.915); // 创建点坐标
        mapObj.setCenter(point); // 设置地图中心点坐标
        
        
        mapObj.bind(mapObj,"click",getLnglat);
        
    }
    
    var info = {
        m1:{cnt:"<b>  高德软件</b><br/>  电话 : 010-84107000<br/>   邮编 : 100102<br/>  地址 : 北京市望京阜通东大街方恒国际中心A座16层",
            lng:116.37388157654,
            lat:39.907409934248,
            iof:0},
        m2:{cnt:'<img src="http://www.sci99.com/Images/2011/scilogo.gif" alt="卓创资讯-中国大宗商品定价平台" width="947" height="82"><b>  卓创资讯</b><br/>  电话 : 0533-8809999<br/>   邮编 : 255400<br/>  地址 : 山东省淄博市临淄区一诺路105号',
            lng:118.27760696,
            lat:36.82274385,
            iof:-28},
        m3:{cnt:"<b>  高德软件</b><br/>  电话 : 010-84107000<br/>   邮编 : 100102<br/>  地址 : 北京市望京阜通东大街方恒国际中心A座16层",
            lng:117.37388157654,
            lat:39.907409934248,
            iof:0},
        m4:{cnt:'<img src="http://www.sci99.com/Images/2011/scilogo.gif" alt="卓创资讯-中国大宗商品定价平台" width="947" height="82"><b>  卓创资讯</b><br/>  电话 : 0533-8809999<br/>   邮编 : 255400<br/>  地址 : 山东省淄博市临淄区一诺路105号',
            lng:119.27760696,
            lat:36.82274385,
            iof:-28},
        size:4};
    function test() {
        mapObj.clearMap();
        for(k in info){
            if(k == 'size') continue;
            mapObj.addOverlays(
                new AMap.Marker({
                    id:k,
                    position:new AMap.LngLat(info[k].lng,info[k].lat),
                    offset:new AMap.Pixel(-14,-34),
                    icon:new AMap.Icon({
                        size:new AMap.Size(27,36),
                        image:"http://api.amap.com/webapi/static/Images/custom_a_j.png",
                        imageOffset:new AMap.Pixel(info[k].iof,0)
                    })
                })
            );
        }
        for(i=0;i<info.size;i++){
            mapObj.bind(mapObj.getOverlaysByType('marker')[i],"click",
            function(e){
                var se = e;
                var infowin = new AMap.InfoWindow({offset:new AMap.Pixel(-90,-70),content:info[e.currentTarget.id].cnt});
                infowin.open(mapObj,e.lnglat);
            });
        }
    }
    
    function test2() {
        mapObj.clearMap();
    }
</script>
</head>

<body onload="initialize()">
    <div id="container"  style="width: 800px; height: 600px;"></div>
    <input type="button" onclick="test()" value="添加标记">
    <input type="button" onclick="test2()" value="清除">
    <input id="xy" value="">
</body>
</html>